<template>
  <div class="index">
    <router-view />
    <van-tabbar
      v-model="active"
      active-color="#c6002f"
      inactive-color="#b4b4bd"
      route
    >
      <van-tabbar-item to="/home/company">
        <template #icon>
          <i class="iconfont icon-gongsi00"></i>
          <div class="txt">公司</div>
        </template>
      </van-tabbar-item>
      <van-tabbar-item to="/home/topic">
        <template #icon>
          <i class="iconfont icon-icon-write"></i>
          <div class="txt">刷题</div>
        </template>
      </van-tabbar-item>
      <van-tabbar-item to="/home/discover">
        <template #icon>
          <i class="iconfont icon-faxian"></i>
          <div class="txt">发现</div>
        </template>
      </van-tabbar-item>
      <van-tabbar-item to="/home/my">
        <template #icon>
          <i class="iconfont icon-gerenzhongxin"></i>
          <div class="txt">我的</div>
        </template>
      </van-tabbar-item>
    </van-tabbar>
  </div>
</template>

<script>
export default {
  data () {
    return {
      active: ''
    }
  }
}
</script>

<style lang="less" scoped>
.index {
  .iconfont {
    font-size: 20px;
  }
  /deep/.van-tabbar-item__icon {
    font-size: 12px;
  }
  .txt {
    margin-top: 5px;
  }
}
</style>
